<!--
 @description 客户-案例
 @fileName CaseItem.vue
 @author zengqiongying
 @created 2022/11/15 11:41:39
-->
<template>
  <div class="case-list">
    <div v-if="caseData.length===0" class="empty">暂无数据</div>
    <div v-for="(item,i) in caseData" :key="i" class="case-item">
      <div class="i-image">
        <ImageVideo lazy-load fit="cover" :src="item.coverPic" />
      </div>
      <div class="i-title">{{ item.dsgnName }}</div>
    </div>
  </div>
</template>

<script>
import ImageVideo from '@/components/ImageVideo'
export default {
  name: 'CustomerCaseItem',
  components: { ImageVideo },
  props: {
    caseData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {

    }
  },

  computed: {},

  created() {},
  activated() {},

  mounted() {},

  methods: {}
}

</script>
<style lang='less' scoped>
  .case-list{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    padding: 16px 16px 0;
    .empty{
      width: 100%;
      padding-bottom: 16px;
      text-align: center;
      font-size: 12px;
      color: #7D8091;
    }
    .case-item{
      width: calc(50% - 8px);
      border-radius: 12px;
      background: #fff;
      overflow: hidden;
      margin-bottom: 16px;
      margin-right: 16px;
      &:nth-child(2n){
        margin-right: 0;
      }
      .i-image{
        width: 100%;
        height: 100px;
      }
      .i-title{
        padding: 10px;
        box-sizing: border-box;
        line-height: 18px;
        color: #3C4458;
        font-size: 12px;
        text-align: left;
      }
    }
  }
</style>
